﻿@using 第五课.Models.Database;
@{
    var good = ViewData["Good"] as Good;
}
<div class="container">
    <!-- InstanceBeginEditable name="MainBody" -->
    <div class="goods-detail" onload="init()">
        <div class="xgs-row" style="background-color: white;padding: 30px 0;">
            @if (good == null)
            {
                <div>商品不存在</div>
            }
            else
            {
                <div class="detail-panel" style="width: 100%;">
                    <div class="xgs-col3">
                        <img id="pic" src="@good.Cover" height="180" align="center" style="margin: auto;display: block;" />
                    </div>
                    <div class="xgs-col9">
                        <h3 id="goods-title" class="goods-title">@good.Name</h3>
                        <ul id="attr">
                            <li>
                                <span style="float: left;">
                                    价格：
                                </span>
                                <h3 id="price" style="color: red;">@good.Price</h3>
                            </li>
                        </ul>
                        <br />
                        <div class="btn-group" style="display: block; padding-left: 50px;">
                            <!-- <button class="orderBtn" type="button">立即购买</button> -->
                            <button id="orderBtn" class="orderBtn" type="button">加入购物车</button>
                        </div>
                    </div>
                </div>
            }
        </div>
        <!-- 商品详情 -->
        <div class="detail-body">
            <div class="xgs-row" style="padding: 0;background-color: white;margin-top: 20px;">
                <ul class="household-navtab" style="display: inline-block;">
                    <li>
                        <a style="background-color: #69c0ff;color: white;" href="javascript:void(0);"
                           onclick="jumpTab('content',this)">商品详情</a>
                    </li>
                    <!-- <li><a href="javascript:void(0);" onclick="jumpTab('guige',this)">参数规格</a></li> -->
                </ul>
            </div>
            <div class="tab-item" style="padding: 20px 0;background-color: white;">
                <!-- 商品详情 -->
                <div id="content" class="content">

                </div>
                <!-- /商品详情 -->
            </div>

        </div>
        <!-- /商品详情 -->
    </div>
    <!-- InstanceEndEditable -->
</div>



@section script
{
    <script src="https://code.jquery.com/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
        $(function () {
            $("#orderBtn").on("click",
                function () {
                    var goodsid = @good.Id;

                    $.post('/home/shoppingCarAdd', { goodsid: goodsid }, function (data, success) {
                        alert(data);
                        console.log('服务器返回结果：' + data);
                    });
                    });

                });

    </script>
}